<template>
   <PanelSplitTwo bottomToolbarHeight="0" :num="2">
    <template #top>
      <SetUserSelect
        class="queryForm"
        :formData="orderSelect"
        :queryParams="paginationParams"
        @electFun="electFun"
        :buttonIsShow="false"
      ></SetUserSelect>
    </template>
     <template #centerToolbar>
        <div class="vex_flex">
          <el-row :gutter="20" style="margin-bottom: 10px">
            <el-col :span="1.5" v-if="!route.query.id">
              <el-button @click="addStatemenFun">保存</el-button>
            </el-col>
            
            <el-col :span="1.5">
              <el-button @click="Cancel">取消</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button :disabled="!route.query.id" @click="handleQuery">发布</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button :disabled="!route.query.id"  @click="writeOffFun">调整</el-button>
            </el-col>
            <!-- <el-col :span="1.5">
              <el-button :disabled="!route.query.id" @click="handleExport">导出</el-button>
            </el-col> -->
          </el-row>
        <VxeTableGrid
          style="flex: 1;"
          :tableColumn="tableColumn"
          :tableLoading="tableLoading"
          :dataList="dataList"
          :showPagination="true"
          :paginationParams="paginationParams"
          @getList="setQueryParams"
          @selectedChange="selectedChange"
        >
        </VxeTableGrid>
        <el-dialog v-model="dialogFormVisible" title="积分调整">
        <SetUserSelect
          ref="setUserSelect"
          :formData="addorderSelect"
          v-model:queryParams="addpaginationParams"
          :isShowUserBtn="false"
          :labelwidth="180"
          :buttonIsShow="false"
          @adjustPercentFun="adjustPercentFun"
        ></SetUserSelect>
        <template #footer>
          <span class="dialog-footer">
            <el-button v-if="types != 1" @click="dialogFormVisible = false">取消</el-button>
            <el-button type="primary" @click="dialogFormVisibleFun"
              >确定</el-button
            >
          </span>
        </template>
      </el-dialog>
      </div>
      
     </template>
   </PanelSplitTwo>
</template>

<script setup>
import { useRouter, useRoute } from 'vue-router'
import { getFinAccountCheck, addFinAccountCheck, finAccountCheckById, finAccountCheckpublish, writeOff } from "@/api/statements.js";
import datas from './data.js'
const { tableColumn, paginationParams, orderSelect }  = datas
const { proxy } = getCurrentInstance();
const router= useRouter ()
const route = useRoute();
const onlineList = ref([]);
const loading = ref(false);
const total = ref(0);
const pageNum = ref(1);
const pageSize = ref(10);
let tableLoading = ref(false)
const dataList = ref([
])
paginationParams.value = {}
const queryParams = ref({
  ipaddr: undefined,
  userName: undefined
});
// 切换分页
  function setQueryParams(val) {
    paginationParams.value.pageNum = val.pageNum;
   paginationParams.value.pageSize = val.pageSize;
   getList()
  }
  // 选择表格
  function selectedChange(val) {
    console.log(val)
    // this.form.customerId = val.currentItem.customerId;
  }
/** 查询登录日志列表 */
function getList() {
  loading.value = true;
  // initData(queryParams.value).then(response => {
  //   onlineList.value = response.rows;
  //   total.value = response.total;
  //   loading.value = false;
  // });
}
/** 发布 */
function handleQuery() {
  pams.value.itemList.forEach((val) => {
    if (val.id.includes('row')) {
      val.id = ''
    }
  })
  finAccountCheckpublish({
    // ...pams.value,
    id: route.query.id,
    status: 2,
  }).then((res) => {
    proxy.$modal.msgSuccess(`发布成功`);
    finAccountCheckByIdFun()
  })
}
/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}
/** 强退按钮操作 */
function handleForceLogout(row) {
    proxy.$modal.confirm('是否确认强退名称为"' + row.userName + '"的用户?').then(function () {
  return forceLogout(row.tokenId);
  }).then(() => {
    getList();
    proxy.$modal.msgSuccess("删除成功");
  }).catch(() => {});
}

// getList();

const electFun = (data) => {
  if (paginationParams.value.agencyId && paginationParams.value.month && paginationParams.value.year) {
    getFinAccountCheckFun()
  }
}

const finAccountCheckByIdFun = () => {
  finAccountCheckById(route.query.id).then((res) => {
    paginationParams.value = res.data
    dataList.value = res.data.itemList
    pams.value = res.data
    paginationParams.value.setTime = res.data.sendTime
  })
}

route.query.id && finAccountCheckByIdFun();



let pams = ref({})
const getFinAccountCheckFun = () => {
  getFinAccountCheck(paginationParams.value).then((res) => {
    // console.log('fasg325235', res)
    paginationParams.value.integral = res.data.integral
    paginationParams.value.sendTime = res.data.sendTime
    dataList.value = res.data.itemList
    pams.value = res.data
    paginationParams.value.setTime = res.data.sendTime
  })
}

// 保存

const addStatemenFun = () => {
  if(pams.value.itemList && pams.value.itemList.length>0){
    pams.value.itemList.forEach((val) => {
      if (val.id.includes('row')) {
        val.id = ''
      }
    })
    addFinAccountCheck(pams.value).then((res) => {
      proxy.$modal.msgSuccess(`${route.query.id? '修改' : '新增'}成功`);
      if(route.query.id){
        Cancel()
      }
    })
  } else {
    proxy.$modal.msgWarning('对账单明细不为空')
  }
  
}

const Cancel = () => {
  const obj = { path: "/statements/statementsList" };
  proxy.$tab.closeOpenPage(obj);
}

const handleExport = () => {
  proxy.download("/task/finAccountCheck/export", {
    ...paginationParams.value
  }, `config_${new Date().getTime()}.xlsx`);
}

const adjustPercentFun = (val) => {
  addpaginationParams.value.adjustedAmount =  paginationParams.value.integral * val/100
}

const addorderSelect = ref([
{
  label: '调整金额（百分比%）',
  model: 'adjustPercent',
  message: '请输入百分比',
  required: true,
  disabled: false,
  placeholder: '按百分比调整',
  type: 'number',
  span: 24,
  max: 100,
},  
{
  label: '调整后的金额',
  model: 'adjustedAmount',
  message: '请输入调整后的金额',
  required: false,
  disabled: true,
  placeholder: '请输入',
  type: 'input',
  span: 24
},
{
  label: '调整原因',
  model: 'adjustReason',
  message: '请输入调整原因',
  required: true,
  placeholder: '请输入',
  type: 'input',
  span: 24
},
  
])
const dialogFormVisible = ref(false)
const addpaginationParams = ref({})
const writeOffFun = (item) => {
  dialogFormVisible.value = true
  // addpaginationParams.value.changeIntegral = undefined
  // if (!item.integral || item.integral == 0) {
  //   addorderSelect.value[1].disabled = true
  // } else {
  //   addorderSelect.value[1].disabled = false
  //   addorderSelect.value[1].max = item.integral
  // }
  // keys.value = new Date().getTime()
  // items.value = item

}

const dialogFormVisibleFun = () => {
  proxy.$refs.setUserSelect.submitForm().then((val) => {
    writeOff({
      ...pams.value,
      taskId: route.query.id,
      ...val,
      // changeIntegral: val.changeIntegral,
    }).then(() => {
      proxy.$modal.msgSuccess("调整成功");
      finAccountCheckByIdFun()
      dialogFormVisible.value = false
    })
    // console.log('fasdf234', val)
    // console.log(items.value)
    // let str = {}
    // if (items.value.type == 1) {
    //   str.agencyId = items.value.agencyId
    // } else {
    //   str.mrId = items.value.id
    // }
    // finIntegralwrite({
    //   ...str,
    //   integralType: 1,
    //   ...val,
    //   changeIntegral: -val.changeIntegral
    // }).then(() => {
    //   proxy.$modal.msgSuccess(`核销成功`);
      
    //   getList()
    // })
  })
}


</script>
<style scoped>
  .app-container {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 85px);
    overflow: hidden;
  }
  .vex_flex {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
  }
  .flexmin {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
</style>
<style>
.el-input-number.is-controls-right .el-input__inner {
  text-align: left;
}
</style>